<style scoped lang="stylus">
@import "../style/film.styl"
.search-item
  align-items flex-start
  .cover
    width 180px
    height 240px
  strong
    color #ff0000
  .flex-basis
    flex-basis 0
    align-items flex-start
  .line-clamp-4
    line-height 1.4
  .douban
    line-height 40px
    background-color #ffc164
    border-radius 6px
    min-width 130px
  .ad
    line-height 40px
    border 1px solid #999;/*no*/
    border-radius 6px
    color #999
    width 130px
  .checkbox
    width 80px
    height 80px
    background url("../assets/history/icon_check.png") no-repeat center
    background-size 36px
    padding 0 10px
    &.checked
      background-image url("../assets/history/icon_checked.png")
  img
    width 100%
    height 100%
</style>

<template lang="pug">
.search-item.pdb-30.flex(@click="handleClick(item)", :class="{'pdh-20': !showCheck}")
  .checkbox(v-show="showCheck", :class="{checked: checked}", @click.stop="onChecked")
  .cover.relative(:class="{spec: validSpec}")
    img.portrait(v-lazy="getImage(item.cover)")
    .film-tag.absolute(v-if="item.recmdTag > 0", :class="VIDEO_LABEL[item.recmdTag]")
    .film-remark.absolute(v-if="validRemark", :class="isMovie(item) ? 'score': 'set'") {{isMovie(item) ? formatScore(item.score): (item.totalNum === item.updateNum? '已完结' + item.totalNum + '集': '更新至' +  + item.updateNum + '集')}}
  .mgl-10.flex.column.flex-1.flex-basis(:class="{'mgr-20': showCheck}")
    .fz-26.bold(v-html="item.title")
    .line-clamp-4.mgt-6.fz-26(v-html="item.intro")
    .douban.mgt-10.fz-24.white.center(v-if="item.score > 0") 评分 {{formatScore(item.score)}}
    .ad.mgt-10.fz-24.white.center(v-if="item.isAd") 广告
</template>

<script>
import { VIDEO_LABEL } from '../const'

export default {
  name: 'SearchItem',
  props: {
    item: {
      type: Object,
      default() {
        return {}
      }
    },
    showCheck: {
      type: Boolean,
      default: false
    },
    checked: {
      type: Boolean,
      default: false
    }
  },

  data: () => ({
    VIDEO_LABEL
  }),

  computed: {
    validSpec() {
      return this.item.recmdTag > 0 || this.validRemark
    },

    validRemark() {
      if (this.isMovie(this.item)) {
        return this.item.score > 0
      }
      return this.item.updateNum > 0
    }
  },

  methods: {
    onChecked() {
      this.$emit('check', this.item.movieId)
    },
    handleClick (item) {
      if (item.isAd) {
        console.log('这是一个广告')
        if (this.config.env.isApp) {
          this.action('clickAdv', {
            id: item.id,
            title: item.title,
            icon: item.cover,
            type: item.type,
            params: item.params
          })
        }
      } else {
        this.onItemDispatch(item)
      }
    }
  }
}
</script>
